<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户信息表单</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
        }
        form {
            max-width: 400px;
            margin: 0 auto;
        }
        label {
            display: block;
            margin: 10px 0;
        }
        input[type="text"], input[type="date"], input[type="number"] {
            width: calc(100% - 120px);
        }
        .radio-group, .checkbox-group {
            margin: 10px 0;
        }
        .checkbox-group label {
            display: inline-block;
            margin-right: 10px;
        }
        input[type="submit"] {
            display: block;
            margin: 20px auto;
            padding: 10px 20px;
            background-color: #007bff;
            color: white;
            border: none;
            cursor: pointer;
        }
        input[type="submit"]:hover {
            background-color: #0056b3;
        }
    </style>
</head>
<body>
<form action="test" method="post">
    <label for="id">ID:</label>
    <input type="text" id="id" name="id" required>

    <label for="username">用户名:</label>
    <input type="text" id="username" name="username" required>

    <label for="birthday">生日:</label>
    <input type="date" id="birthday" name="birthday" required>

    <label>性别:</label>
    <div class="radio-group">
        <label><input type="radio" name="sex" value="女" checked> 女</label>
        <label><input type="radio" name="sex" value="男"> 男</label>
    </div>

    <label for="salary">薪资:</label>
    <input type="number" id="salary" name="salary" step="0.01" required>

    <label>是否同意条款:</label>
    <div class="checkbox-group">
        <label><input type="checkbox" name="ok" checked> 是</label>
    </div>

    <label>掌握的技术：</label>
    <div class="checkbox-group">
        <label><input type="checkbox" name="arrStr" value="java" checked> Java</label>
        <label><input type="checkbox" name="arrStr" value="c#"> C#</label>
        <label><input type="checkbox" name="arrStr" value="python"> Python</label>
    </div>

    <label>掌握的技术（数字表示）：</label>
    <div class="checkbox-group">
        <label><input type="checkbox" name="arrInt" value="1" checked> Java</label>
        <label><input type="checkbox" name="arrInt" value="3"> C#</label>
        <label><input type="checkbox" name="arrInt" value="4"> Python</label>
    </div>

    <input type="submit" value="提交">
</form>
</body>
</html>